
.contener {
	position: relative;
	.img_box {
		width: 100%;
		height: 194rpx;
		// border: 2rpx solid #000;
	}
	.contener_box {
		padding-top: 140rpx;
		.nav_box {
			padding: 20rpx;
			width: 670rpx;
			height: 238rpx;
			background: #ffffff;
			position: absolute;
			top: 104rpx;
			left: 0;
			right: 0;
			margin: 0 auto;
			box-shadow: 0rpx 6rpx 20rpx rgba(225, 225, 225, 1);
			border-radius: 15rpx;
			.nav_a {
				display: flex;
				justify-content: space-between;
				.nav_left {
					text {
						font-size: 28rpx;
						font-family: PingFang SC;
						font-weight: 400;
						color: #373c46;
						line-height: 50rpx;
						opacity: 1;
					}
				}
				.nav_right {
					padding-top: 28rpx;
					text {
						display: block;
						&:nth-child(1) {
							font-size: 24rpx;
							font-family: DIN;
							font-weight: 400;
							color: #676b72;
							line-height: 1;
						}
						&:nth-child(2) {
							font-size: 24rpx;
							font-family: PingFang SC;
							font-weight: 400;
							color: #bcc3cd;
							line-height: 1;
						}
					}
				}
			}

			.nav_b {
				display: flex;
				justify-content: space-between;
				& > view {
					text {
						display: block;
						&:nth-child(2) {
							font-size: 24rpx;
							font-family: PingFang SC;
							font-weight: 400;
							color: #bcc3cd;
							opacity: 1;
						}
					}
					.nav-text_a {
						font-size: 56rpx;
						font-family: DIN;
						font-weight: 400;
						color: #f92f20;
						line-height: 82rpx;
					}
					.nav-text_b {
						padding-top: 32rpx;
						font-size: 28rpx;
						font-family: DIN;
						font-weight: 400;
						color: #f92f20;
						line-height: 50rpx;
					}
					.nav-text_c {
						padding-top: 32rpx;
						font-size: 28rpx;
						font-family: DIN;
						font-weight: 400;
						line-height: 50rpx;
						color: #373c46;
					}
				}
			}
		}
		.charts_box {
			margin: 0 auto;
			width: 670rpx;
			height: 586rpx;
			// background: #f3ff0f;
			box-shadow: 0rpx 6rpx 20rpx rgba(225, 225, 225, 1);
			border-radius: 12rpx;
			margin-top: 24rpx;
			padding: 24rpx;
			.nav_charts {
				font-size: 28rpx;
				font-family: PingFang SC;
				font-weight: bold;
				color: #2e3033;
			}
		}
		.ment_box {
			margin: 0 auto;
			width: 670rpx;
			height: 478rpx;
			// background: #94ffcf;
			box-shadow: 0rpx 6rpx 20rpx rgba(225, 225, 225, 1);
			margin-top: 24rpx;
			padding: 24rpx;
			border-radius: 12rpx;
			.nav_ment {
				font-size: 28rpx;
				font-family: PingFang SC;
				font-weight: bold;
				color: #2e3033;
			}
			.flex_ment {
				display: flex;
				justify-content: space-between;
				width: 100%;
				.ment_l {
					width: 33%;
					// background: #007AFF;
					text {
						display: block;
						margin-top: 32rpx;
						font-size: 24rpx;
						font-family: PingFang SC;
						color: #666666;
						opacity: 1;
						&:nth-child(1) {
							font-size: 24rpx;
							font-family: PingFang SC;
							font-weight: 400;
							line-height: 34rpx;
							color: #bcc3cd;
							opacity: 1;
							margin-top: 16rpx;
						}
					}
				}
				.ment_i {
					width: 33%;
					text-align: center;
					text {
						display: block;
						font-size: 24rpx;
						font-family: DIN;
						font-weight: bold;
						color: #e74d45;
						margin-top: 32rpx;
						&:nth-child(1) {
							font-size: 24rpx;
							font-family: PingFang SC;
							font-weight: 400;
							line-height: 34rpx;
							color: #bcc3cd;
							margin-top: 16rpx;
						}
					}
				}
				.ment_r {
					width: 33%;
					text-align: right;
					& > text {
						display: block;
						font-size: 24rpx;
						font-family: DIN;
						font-weight: 400;
						color: #999999;
						margin-top: 32rpx;
						&:nth-child(1) {
							font-size: 24rpx;
							font-family: PingFang SC;
							font-weight: 400;
							line-height: 34rpx;
							color: #bcc3cd;
							opacity: 1;
							margin-top: 16rpx;
						}
						text {
							font-weight: bold;
							color: #000;
						}
					}
				}
			}
		}

		.rule_box {
			margin: 0 auto;
			width: 670rpx;
			// background: #37fff9;
			box-shadow: 0rpx 6rpx 20rpx rgba(225, 225, 225, 1);
			opacity: 1;
			margin-top: 24rpx;
			border-radius: 12rpx;
			padding: 24rpx;
			.rule_nav {
				width: 100%;
				background-color: #fff;
				& > text {
					display: inline-block;
					// width: 144rpx;
					font-size: 24rpx;
					font-family: PingFang SC;
					font-weight: 500;
					// background-color: #DD524D;
					margin-right: 50rpx;
					color: #2e3033;
					text-align: center;
					.rule_line {
						margin: 0 auto;
						display: block;
						width: 112rpx;
						height: 4rpx;
						background-color: #3a6af6;
						opacity: 1;
						margin-top: 8rpx;
						vertical-align: middle;
					}
				}
				.active_rule {
					font-size: 32rpx;
					font-family: PingFang SC;
					font-weight: bold;
					line-height: 44rpx;
					color: #2e3033;
					opacity: 1;
				}
			}
			.rule_cont {
				// background-color: #82848A;
				padding: 14rpx 0;
				width: 100%;
				.flex_rule {
					display: flex;
					justify-content: space-between;
					view {
						width: 33%;
						text-align: center;
						font-size: 28rpx;
						font-family: PingFang SC;
						font-weight: 400;
						color: #2e3033;
					}
				}
			}
			.rule_int {
				width: 618rpx;
				// height: 416rpx;
				background: #f9fafc;
				opacity: 1;
				margin-left: 6rpx;
				margin-top: 40rpx;
				padding: 24rpx;
				.rule_btn {
					margin-bottom: 16rpx;
					.ol_box {
						// display: inline-block;
						float: left;
						width: 16rpx;
						height: 16rpx;
						background: #3a6af6;
						border-radius: 50%;
						opacity: 1;
						margin-right: 16rpx;
						margin-top: 8rpx;
					}
					.text_box {
						float: right;
						// display: inline-block;
						width: 538rpx;
						// background-color: #1890FF;
						font-size: 24rpx;
						font-family: PingFang SC;
						font-weight: 400;
						line-height: 34rpx;
						color: #949aa7;
					}
				}
				.rule_put {
					font-size: 24rpx;
					font-family: PingFang SC;
					font-weight: 400;
					line-height: 34rpx;
					color: #bcc3cd;
					text-align: center;
					margin-top: 12rpx;
					text {
						margin-right: 8rpx;
					}
				}
			}

			.archives_box {
				.archives_nav {
					font-size: 28rpx;
					font-family: PingFang SC;
					font-weight: 600;
					color: #333333;
				}
				.archives_flex {
					display: flex;
					justify-content: space-between;
					view {
						&:nth-child(1) {
							text {
								margin-top: 26rpx;
								display: block;
								font-size: 24rpx;
								font-family: PingFang SC;
								font-weight: 400;
								color: #bcc3cd;
							}
						}
						&:nth-child(2) {
							text {
								margin-top: 26rpx;
								display: block;
								font-size: 24rpx;
								font-family: PingFang SC;
								font-weight: 400;
								color: #676767;
							}
						}
					}
				}
			}
		}

		.ucherts_box {
			margin: 0 auto;
			width: 670rpx;
			// height: 360rpx;
			background: #ffffff;
			box-shadow: 0rpx 4rpx 20rpx rgba(225, 225, 225, 1);
			border-radius: 12rpx;
			margin-top: 24rpx;
			padding: 24rpx;
			.ucherts_nav {
				font-size: 28rpx;
				font-family: PingFang SC;
				font-weight: 600;
				color: #333333;
				.content_box {
					display: flex;
					flex-direction: column;
					flex: 1;
				}

				.charts-box {
					width: 100%;
					height: 300rpx;
				}
			}
		}

		.btn_box {
			width: 750rpx;
			height: 228rpx;
			opacity: 1;
			display: flex;
			.btn_l {
				margin-top: 104rpx;
				width: 50%;
				height: 98rpx;
				background: #ffffff;
				opacity: 1;
				text-align: center;
				text {
					font-size: 40rpx;
					font-family: PingFang SC;
					font-weight: 400;
					line-height: 98rpx;
					color: rgba(58, 106, 246, 0.6);
					opacity: 1;
				}
			}
			.btn_r {
				margin-top: 104rpx;
				width: 50%;
				height: 98rpx;
				background: #3775f6;
				opacity: 1;
				text-align: center;
				text {
					font-size: 40rpx;
					font-family: PingFang SC;
					font-weight: 400;
					line-height: 98rpx;
					color: #ffffff;
				}
			}
		}
	}
}
